---
order: 0
title: Particle
type: Graphics
group: Particle
label: Graphics/Particle
---

The particle (Particle Renderer) [ParticleRenderer](/apis/core/#ParticleRenderer) of the Galacean Engine is a commonly used rendering component with rich properties. By adjusting various property values, you can achieve colorful particle effects.

<Image src="https://mdn.alipayobjects.com/huamei_qbugvr/afts/img/A*oPEmTqfD_asAAAAAAAAAAAAADtKFAQ/original" />

## Components

The particle component can be mounted on an activated Entity in the scene through the shortcut at the top of the hierarchy panel or by adding a component in the inspector panel.

<Image src="https://mdn.alipayobjects.com/huamei_qbugvr/afts/img/A*fD8iTZUbiI4AAAAAAAAAAAAADtKFAQ/original" />

After adding, you can view the particle properties in the inspector panel. The particle panel at the bottom left corner of the view window can control the playback of particle effects in the view window.

<Image src="https://mdn.alipayobjects.com/huamei_qbugvr/afts/img/A*KekfSb89BSIAAAAAAAAAAAAADtKFAQ/original" />

You can also mount the particle component in the script.

```ts
// 创建实体
const entity = root.createChild("particleEntity");
// 创建粒子组件
let particleRenderer = particleEntity.addComponent(ParticleRenderer);
```

## Rendering Material

[ParticleMaterial](/apis/core/#ParticleMaterial) is the default material for particles.

In the editor, create it by adding material - selecting particle material. After editing, go back to the particle inspector panel to select and use the material.

<Image src="https://mdn.alipayobjects.com/huamei_qbugvr/afts/img/A*l8WoQbbd6lMAAAAAAAAAAAAADtKFAQ/original" alt="avatar" style={{ zoom: "50%" }} />

Or in the script:

```ts
// Add particle material
const material = new ParticleMaterial(engine);
particleRenderer.setMaterial(material);
```

| Property                                             | Description |
| ---------------------------------------------------- | ----------- |
| [baseColor](/apis/core/#ParticleMaterial-baseColor)   | Base Color  |
| [baseTexture](/apis/core/#ParticleMaterial-baseColor) | Base Texture|

## Playback Control

The particle panel that appears when an entity with a particle component is selected allows you to control the playback of particle effects in the view window.

It should be noted that adjustments to particle playback on this panel are only for previewing in the view window and do not change the properties of the particle component. If you need to change the playback-related properties of the particle, you need to adjust them in the inspector panel.

<Image src="https://mdn.alipayobjects.com/huamei_qbugvr/afts/img/A*3-04T5v0xisAAAAAAAAAAAAADtKFAQ/original" alt="avatar" style={{ zoom: "50%" }} />

| Preview Playback Options | Description                                      |
| ------------------------ | ------------------------------------------------ |
| Replay                   | Stops the current particle effect playback and immediately starts playing from the beginning |
| Stop                     | Stops the particle effect playback and resets to the initial state |
| Pause / Play             | Pauses / Starts playing the particle effect      |
| Selected / Global        | Plays the currently selected particle or all particles in the scene |
| Bounding Box             | Bounding box of the currently selected particle  |

Or in the code,

```ts
// 播放
particleRenderer.generator.play();
// 停止
particleRenderer.generator.stop();
// 调整播放速度
particleRenderer.generator.main.simulationSpeed = 2;
```

## Particle Generator

The [generator](/apis/core/#ParticleGenerator) property of `ParticleRenderer` is mainly responsible for the generation and playback of particles. The functions related to particle generation are composed of multiple modules, including the main module, emitter module, lifetime size module, lifetime color module, lifetime speed module, lifetime rotation module, and texture sheet animation module. In the editor's particle inspector panel, you can visually see each module and its options.

## Other Parameters

<Image src="https://mdn.alipayobjects.com/huamei_qbugvr/afts/img/A*MiCESpgK-LwAAAAAAAAAAAAADtKFAQ/original" alt="avatar" style={{ zoom: "50%" }} />

| Property | Description |
| --- | --- |
| [velocityScale](/apis/core/#ParticleRenderer-velocityScale) | Specifies the extent to which particles stretch based on their speed |
| [lengthScale](/apis/core/#ParticleRenderer-lengthScale) | Defines the extent to which particles stretch in their direction of motion, defined as the ratio of the particle's length to its width |
| [pivot](/apis/core/#ParticleRenderer-pivot) | The pivot of the particle |
| [renderMode](/apis/core/#ParticleRenderer-renderMode) | The rendering mode of the particle |
| [mesh](/apis/core/#ParticleRenderer-mesh) | The mesh of the particle, effective when `renderMode` is `Mesh` |
